<template>
  <div>
    <el-dialog class="positionDialog" :title="this.ruleForm.id ? '修改' : '新增'" :visible="showDialog" width="98%"
      :before-close="handleClose" :modal="false" :close-on-click-modal="false">
      <div class="content">
        <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="120px" class="demo-ruleForm">
          <div class="title fir-title">
            <svg-icon class="svg-icon" icon-class="infoAdd" />
            <span>{{ this.ruleForm.id ? "修改出场信息" : '新增出场信息' }}</span>
          </div>
          <div class="title">
            <span>客户信息</span>
          </div>
          <div class="form">
            <el-form-item label="订单号" prop="">
              <el-input v-model="ruleForm.orderNumber" placeholder="请输入订单号" :disabled="true"></el-input>
            </el-form-item>
            <el-form-item label="客户姓名" prop="clientName">
              <el-select @change="client_nameChange" style="width: 100%;" :disabled="true" v-model="ruleForm.clientName"
                filterable placeholder="请选择客户姓名或输入关键词">
                <el-option v-for="item, index in carList" :key="item.value + index" :label="item.label"
                  :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="地址" prop="clientAddress">
              <el-input v-model="ruleForm.clientAddress" placeholder="请输入地址" :disabled="true"></el-input>
            </el-form-item>
            <el-form-item label="手机号" prop="phone">
              <el-input v-model="ruleForm.phone" placeholder="请输入手机号" :disabled="true"></el-input>
            </el-form-item>
            <el-form-item label="总量(万斤)" prop="">
              <el-input v-model="ruleForm.contractNumber" placeholder="请输入总量" :disabled="true"></el-input>
            </el-form-item>
          </div>
          <div class="title">
            <span>车辆信息</span>
          </div>
          <div class="form">
            <el-form-item label="智慧卡号" prop="">
              <el-input v-model="ruleForm.cardNumber" placeholder="请输入智慧卡号" :disabled="true"></el-input>
            </el-form-item>
            <el-form-item label="车牌号" prop="carNumber">
              <el-select style="width: 100%;" :disabled="ruleForm.id ? true : false" v-model="ruleForm.carNumber"
                filterable placeholder="请选择车牌号或输入关键词">
                <el-option v-for="item, index in carinfoList" :key="item + index" :label="item" :value="item">
                </el-option>
              </el-select>
              <!-- <el-button class="redAdd" @click="handleShowAddDialog('carInfo')">新增</el-button> -->
            </el-form-item>
            <el-form-item label="司机姓名" prop="driverName">
              <el-select style="width: 100%;" v-model="ruleForm.driverName" filterable placeholder="请选择司机姓名或输入关键词">
                <el-option v-for="item, index in driverInfoLsit" :key="item.label + index" :label="item.label"
                  :value="item.label">
                </el-option>
              </el-select>
              <el-button class="redAdd" @click="handleShowAddDialog('driverInfo')">新增</el-button>
            </el-form-item>

          </div>
          <div class="title">
            <span>仓库信息</span>
          </div>
          <div class="form">
            <el-form-item label="种类" prop="">
              <el-select style="width: 100%;" v-model="ruleForm.type" filterable placeholder="请选择种类或输入关键词"
                @change="handleChangeCropType">
                <el-option v-for="item, index in cropinfoList" :key="item.label + index" :label="item.label"
                  :value="item.label">
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="品种" prop="">
              <el-select style="width: 100%;" :disabled="ruleForm.type ? false : true" v-model="ruleForm.variety"
                filterable placeholder="请选择品种或输入关键词">
                <el-option v-for="(item, index) in cropVarietiesList" :key="item + index" :label="item" :value="item">
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="品质" prop="">
              <el-select style="width: 100%;" :disabled="ruleForm.type ? false : true" v-model="ruleForm.quality"
                filterable placeholder="请选择品质或输入关键词" @change="handleWarehouse">
                <el-option v-for="(item, index) in cropQualityList" :key="item + index" :label="item" :value="item">
                </el-option>
              </el-select>
              <!-- <el-button class="redAdd" @click="handleShowAddDialog('cropVariety')">新增</el-button> -->
            </el-form-item>
            <el-form-item label="仓号" prop="">
              <el-select style="width: 100%;" :disabled="ruleForm.quality ? false : true"
                v-model="ruleForm.warehouseCode" filterable placeholder="请选择仓号或输入关键词" @change="handleDuo">
                <el-option v-for="(item, index) in warehouseList" :key="item.label" :label="item.label"
                  :value="item.label">
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="垛号" prop="">
              <el-select style="width: 100%;" :disabled="ruleForm.warehouseCode ? false : true"
                v-model="ruleForm.stampCode" filterable placeholder="请选择垛号或输入关键词">
                <el-option v-for="(item, index) in duoList" :key="item + index" :label="item" :value="item">
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="类别" prop="">
              <el-select style="width: 100%;" v-model="ruleForm.category" filterable placeholder="请选择类别或输入关键词">
                <el-option v-for="(item, index) in categoryList" :key="item + index" :label="item" :value="item">
                </el-option>
              </el-select>
              <el-button class="redAdd" @click="handleShowAddDialog('CropType')">新增</el-button>
            </el-form-item>
            <el-form-item label="货物规格" prop="">
              <el-select style="width: 100%;" v-model="ruleForm.goodsSpecifications" filterable
                placeholder="请选择货物规格或输入关键词">
                <el-option v-for="(item, index) in specsList" :key="item.value" :label="item.label" :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
          </div>
          <div class="title">
            <span>过磅信息</span>
          </div>
          <div class="form">
            <el-form-item label="毛重(kg)" prop="">
              <el-input oninput="value=value.replace(/[^0-9.]/g,'')" v-model="ruleForm.totalWeight" placeholder="请输入毛重"
                @blur="handleGW" :disabled="ruleForm.type ? false : true"></el-input>
            </el-form-item>
            <el-form-item label="皮重(kg)" prop="tareWeight">
              <el-input oninput="value=value.replace(/[^0-9.]/g,'')" v-model="ruleForm.tareWeight" placeholder="请输入皮重"
                @blur="handleTARE" :disabled="ruleForm.type ? false : true"></el-input>
            </el-form-item>
            <el-form-item label="净重(kg)" prop="">
              <el-input v-model="ruleForm.netWeight" @change="shizhongchange('jing')" placeholder="请输入净重"
                :disabled="true"></el-input>
            </el-form-item>
            <el-form-item label="过毛时间" prop="">
              <el-date-picker style="width: 100%;" v-model="ruleForm.totalWeighTime" format="yyyy-MM-dd HH:mm:ss"
                value-format="yyyy-MM-dd HH:mm:ss" type="datetime" placeholder="请选择过毛时间">
              </el-date-picker>
            </el-form-item>
            <el-form-item label="过皮时间" prop="">
              <el-date-picker style="width: 100%;" v-model="ruleForm.tareWeighTime" format="yyyy-MM-dd HH:mm:ss"
                value-format="yyyy-MM-dd HH:mm:ss" type="datetime" placeholder="请选择过皮时间">
              </el-date-picker>
            </el-form-item>
            <el-form-item label="" prop="">

            </el-form-item>


          </div>
          <div class="title">
            <span>扦样质检信息</span>
          </div>
          <div class="form">
            <el-form-item label="含水量(%)" :prop="ruleForm.totalWeight ? 'waterContent' : ''">
              <el-input oninput="value=value.replace(/[^0-9.]/g,'')" v-model="ruleForm.waterContent"
                placeholder="请输入含水量(0-100)" @change="shizhongchange('shui')"
                :disabled="ruleForm.totalWeight ? false : true"></el-input>
            </el-form-item>
            <el-form-item label="含油量(%)" prop="">
              <el-input oninput="value=value.replace(/[^0-9.]/g,'')" v-model="ruleForm.oilContent"
                placeholder="当作物为油菜时请输入含油量(0-100)"
                :disabled="(ruleForm.totalWeight && ruleForm.type == '油菜') ? false : true"></el-input>
            </el-form-item>
            <el-form-item label="面筋值(%)" :prop="ruleForm.totalWeight ? '' : ''">
              <el-input oninput="value=value.replace(/[^0-9.]/g,'')" v-model="ruleForm.glutenValue"
                placeholder="当作物为小麦时请输入面筋值(0-100)"
                :disabled="(ruleForm.totalWeight && ruleForm.type == '小麦') ? false : true"></el-input>
            </el-form-item>
          </div>
          <div class="title">
            <span>扣项信息</span>
          </div>
          <div class="form">

            <el-form-item label="袋重(kg)" prop="">
              <el-input v-model="ruleForm.packageWeight" oninput="value=value.replace(/[^0-9.]/g,'')"
                @change="shizhongchange('dai')" placeholder="请输入袋重"></el-input>
            </el-form-item>
            <el-form-item label="扣重(kg)" prop="">
              <el-input v-model="ruleForm.deductWeight" oninput="value=value.replace(/[^0-9.]/g,'')"
                @change="shizhongchange('kou')" placeholder="请输入扣重"></el-input>
            </el-form-item>
            <el-form-item label="实重(kg)" prop="">
              <el-input v-model="ruleForm.actualWeight" disabled oninput="value=value.replace(/[^0-9.]/g,'')"
                placeholder="请输入实重"></el-input>
            </el-form-item>

          </div>
        </el-form>
      </div>
      <div class="dialog-footer333">
        <el-button class="submit" @click="handleSubmit">确 认</el-button>
        <el-button class="back" @click="handleClose">返 回</el-button>
      </div>
    </el-dialog>
    <!-- 客户姓名 -->
    <CustomerInfo ref="CustomerInfo" :getKehuList="getKehuList" :showDialog.sync="customerInfo"></CustomerInfo>
    <!-- 新增车牌号 -->
    <CarInfo ref="CarInfo" :showDialog.sync="carInfo" @handleRefresh="handleRefreshList('carInfo')"></CarInfo>
    <!-- 司机信息 -->
    <DriverInfo ref="DriverInfo" :showDialog.sync="driverInfo" @handleRefresh="handleRefreshList('driverInfo')">
    </DriverInfo>
    <!-- 作物类别 -->
    <CropType ref="CropType" :showDialog.sync="cropType" @handleRefresh="handleRefreshList('cropType')"></CropType>
  </div>
</template>

<script>
import { Message } from 'element-ui'
import '../scss/style.scss'
import rules from '@/utils/rules'
import { getUserKey } from '@/utils/auth'
import { formatDate } from '@/utils/methods'
import { AddOrEditvehicleList } from '@/api/table'
import { filterSelect } from '@/utils/methods'
import { clientTableApi } from '@/api/info'
import { addApi, editApi, warehouseApi, getCropTypeApi, getduoApi, getQualityApi } from '@/api/inCage'
import { selectApi, carinfoApi, driverInfoApi, cropTypeApi, categorySelectApi } from '@/api/select'
import CustomerInfo from '@/views/info/components/CustomerInfo/dialog/AddPopu.vue'
import CarInfo from '@/views/info/components/CarInfo/dialog/AddPopu.vue'
import DriverInfo from '@/views/info/components/DriverInfo/dialog/AddPopu.vue'
import TableCom from '@/components/TableCom'
import CropType from '@/views/info/components/CropType/dialog/AddPopu.vue'
import HandlTable from '../dialog/HandlTable.vue'
import Cookies from 'js-cookie'
export default {
  props: ['showDialog'],
  components: {
    CarInfo,
    DriverInfo,
    CustomerInfo,
    TableCom,
    HandlTable,
    CropType,
  },
  data() {
    return {
      ruleForm: {
        clientName: "",
        carName: '',
        carType: '',
        createUser: '',
        createTime: '',
        phone: "",
        teamCode: '',
        contractNumber: "",
        actualWeight: ''
      },
      tableDateObj: {

      },
      rules: rules,
      carList: [],
      carInfo: false,
      driverInfo: false,
      customerInfo: false,
      dialogVisible: false,
      delList: [],
      teamCodeList: [],
      farmCodeList: [],
      driverInfoLsit: [],
      carinfoList: [],
      categoryList: [],
      warehouseList: [],
      cropinfoList: [],
      cropVarietiesList: [],
      cropQualityList: [],
      duoList: [],
      specsList: [],
      cropType: false
    };
  },
  methods: {
    shizhongchange(type) {
      if (type == 'kou') {
        this.ruleForm = {
          ...this.ruleForm,
          actualWeight: (this.ruleForm.netWeight - this.ruleForm.packageWeight - this.ruleForm.deductWeight).toFixed(2)
        }
      }
      if (type == 'dai') {
        this.ruleForm = {
          ...this.ruleForm,
          actualWeight: (this.ruleForm.netWeight - this.ruleForm.packageWeight - (this.ruleForm.deductWeight || 0)).toFixed(2)
        }
      }
      if (type == 'shui') {
        this.ruleForm = {
          ...this.ruleForm,
          actualWeight: (this.ruleForm.netWeight - (this.ruleForm.packageWeight || 0) - (this.ruleForm.deductWeight || 0)).toFixed(2)
        }
      }
      if (type == 'jing') {
        this.ruleForm = {
          ...this.ruleForm,
          actualWeight: (this.ruleForm.netWeight - (this.ruleForm.packageWeight || 0) - (this.ruleForm.deductWeight || 0)).toFixed(2)
        }
      }

      // netWeight waterContent packageWeight deductWeight
    },
    delTable() {
      this.tableData = this.tableData.filter((item) => {
        return !this.delList.includes(item.id)
      })
    },
    addTableDate(type, data) {
      if (type == 'add') {
        this.tableData.push({
          ...data,
          id: new Date().getTime(),
        })
      } else {
        const index = this.tableData.findIndex((item) => {
          return item.id == data.id
        })
        if (index != -1) {
          this.tableData[index] = {
            ...data,
          }
        }
      }
    },
    client_nameChange(e) {
      const obj = this.carList.filter((item) => { return item.value == e })[0]
      this.ruleForm = {
        ...this.ruleForm,
        client_address: obj.address,
        phone: obj.phone
      }
    },
    // 搜索框时间
    handleFormData() {

    },
    // 选择垛号
    async handleDuo() {
      this.ruleForm = {
        ...this.ruleForm,
        stampCode: ""
      }
      this.ruleForm.warehouseId = this.warehouseList.filter((item) => { return item.label == this.ruleForm.warehouseCode })[0].value
      // this.ruleForm.warehouseId = this.warehouseList.find(item => item.value == this.ruleForm.warehouseCode).value
      if (this.ruleForm.teamCode && this.ruleForm.type && this.ruleForm.quality && this.ruleForm.warehouseCode) {
        const value = this.warehouseList.filter((item) => { return item.label == this.ruleForm.warehouseCode })[0].value
        let res = await getduoApi({ farmCode: this.$farmCode, teamCode: this.ruleForm.teamCode, cropType: this.ruleForm.type, cropQuality: this.ruleForm.quality, wareId: value })
        this.duoList = res.data
      }
    },
    getKehuList() {
      clientTableApi({ size: 1000, current: 1 }, {}).then(res => {
        this.carList = res.data.records.map((item) => {
          return {
            ...item,
            value: item.clientName,
            label: item.clientName
          }
        })
      })
      driverInfoApi(this.$farmCode).then((res) => {
        this.driverInfoLsit = res.data
        this.$refs.ruleForm.clearValidate('driverName')
      })
      carinfoApi(this.$farmCode).then((res) => {
        if (res.data && res.data.length) {
          this.carinfoList = res.data
        }
        this.$refs.ruleForm.clearValidate('carNumber')

      })
      categorySelectApi().then((res) => {
        if (res.data && res.data.length) {
          this.categoryList = res.data
        }
      })
      selectApi({ type: this.$farmCode }).then((res) => {
        this.teamCodeList = res.data.dictItemList
      })
      getCropTypeApi({ farmCode: this.$farmCode, teamCode: this.ruleForm.teamCode }).then((res) => {
        if (res.code == 0) {
          this.cropinfoList = res.data
        }
      })
      selectApi({ type: "specs" }).then((res) => {
        this.specsList = res.data.dictItemList
      })
      if (this.ruleForm.id) {
        this.teamCodeChangeEdit()
        if (this.ruleForm.type) {
          this.handleChangeCropTypeEdit()
          this.handleWareHouseEdit()
          setTimeout(() => {
            if (this.ruleForm.warehouseCode) {
              this.handleDuoEdit()
            }
          }, 100);

        }
      }
    },
    async handleWarehouse() {
      this.ruleForm = {
        ...this.ruleForm,
        warehouseCode: ""
      }
      if (this.ruleForm.teamCode && this.ruleForm.type && this.ruleForm.quality) {
        let res = await warehouseApi({ farmCode: this.$farmCode, teamCode: this.ruleForm.teamCode, cropType: this.ruleForm.type, cropQuality: this.ruleForm.quality })
        if (res.code == 0) {
          this.warehouseList = res.data
        } else {
          this.warehouseList = []
          this.ruleForm.warehouseCode = ''
        }
      }
    },
    async handleWareHouseEdit() {
      if (this.ruleForm.teamCode && this.ruleForm.type && this.ruleForm.quality) {
        let res = await warehouseApi({ farmCode: this.$farmCode, teamCode: this.ruleForm.teamCode, cropType: this.ruleForm.type, cropQuality: this.ruleForm.quality })
        if (res.code == 0) {
          this.warehouseList = res.data
        } else {
          this.warehouseList = []
          this.ruleForm.warehouseCode = ''
        }
      }
    },
    // 选择作物品种
    async handleChangeCropType(e) {
      if (!e) return
      Promise.all([
        getQualityApi({ farmCode: this.ruleForm.farmCode, teamCode: this.ruleForm.teamCode, cropType: this.ruleForm.type }),
        cropTypeApi(e)
      ]).then(res => {
        this.cropQualityList = res[0].data
        this.cropVarietiesList = res[1].data
      })

    },
    // 选择作物品种
    async handleChangeCropTypeEdit() {
      Promise.all([
        getQualityApi({ farmCode: this.ruleForm.farmCode, teamCode: this.ruleForm.teamCode, cropType: this.ruleForm.type }),
        cropTypeApi(this.ruleForm.type)
      ]).then(res => {
        this.cropQualityList = res[0].data
        this.cropVarietiesList = res[1].data
      })

    },
    teamCodeChangeEdit() {
      getCropTypeApi({ farmCode: this.$farmCode, teamCode: this.ruleForm.teamCode }).then((res) => {
        if (res.code == 0) {
          this.cropinfoList = res.data
        }
      })
    },
    async handleDuoEdit() {
      // const value=this.warehouseList.filter((item)=>{return item.label==this.ruleForm.warehouseCode})[0].value
      let res = await getduoApi({ farmCode: this.$farmCode, teamCode: this.ruleForm.teamCode, cropType: this.ruleForm.type, cropQuality: this.ruleForm.quality, wareId: this.ruleForm.warehouseId })
      this.duoList = res.data
    },
    handleClose() {
      this.$emit('update:showDialog', false)
      this.ruleForm = {
        clientName: "",
        carName: '',
        carType: '',
        createUser: '',
        createTime: '',
        phone: "",
        teamCode: '',
        contractNumber: ""
      };
      this.$refs.ruleForm.resetFields();
    },
    handleSubmit() {
      this.$refs.ruleForm.validate(async (valid) => {
        if (valid) {

          this.ruleForm = {
            ...this.ruleForm,
            saleId: sessionStorage.getItem("tableInfoViewId")
          }
          if (this.ruleForm.id) {
            this.ruleForm = {
              ...this.ruleForm,
              status: this.ruleForm.status == '未完成' ? '0' : '1'
            }
          }
          AddOrEditvehicleList(this.ruleForm).then((res) => {
            if (res.message == 'true') {
              Message({
                type: 'success',
                message: '添加成功'
              })
              this.$emit('handleRefresh')
              this.$emit('handleUpdate')
              this.handleClose()
            } else {
              Message({
                type: 'error',
                message: res.message
              })
            }
          })

        } else {
          return false;
        }
      });
    },
    // 获取填报人时间
    handleGetInfo() {
      this.ruleForm.createUser = getUserKey() || 'nkjtcyf'
      this.ruleForm.createTime = formatDate(new Date())
    },
    // 新增弹框
    handleShowAddDialog(val) {
      if (val === 'CustomerInfo') {
        this.$refs.CustomerInfo.handleGetInfo()
        this.customerInfo = true
      }
      if (val === 'carInfo') {
        this.$refs.CarInfo.handleGetInfo()
        this.$refs.CarInfo.handleGetSelect()
        this.carInfo = true
      }
      if (val === 'driverInfo') {
        this.$refs.DriverInfo.handleGetInfo()
        this.$refs.DriverInfo.handleGetSelect()
        this.driverInfo = true
      }
      if (val === 'cropVariety') {
        this.$refs.CropVariety.handleGetInfo()
        this.$refs.CropVariety.handleGetSelect()
        this.cropVariety = true
      }
      if (val == 'handleTable') {
        this.$refs.handlTableAdd.handleGetSelect()
        this.dialogVisible = true
      }
      if (val == 'CropType') {
        this.$refs.CropType.handleGetInfo()
        this.cropType = true
      }
    },
    handleGW() {
      if (this.ruleForm.totalWeight) {
        this.ruleForm.totalWeight = (this.ruleForm.totalWeight * 1).toFixed(2)
      }
      if (this.ruleForm.tareWeight && this.ruleForm.totalWeight * 1 > this.ruleForm.tareWeight * 1) {
        this.ruleForm.netWeight = (this.ruleForm.totalWeight * 1 - this.ruleForm.tareWeight * 1).toFixed(2)
        this.ruleForm.actualWeight = (this.ruleForm.netWeight - (this.ruleForm.packageWeight || 0) - (this.ruleForm.deductWeight || 0)).toFixed(2)
      } else if (this.ruleForm.tareWeight && this.ruleForm.totalWeight * 1 <= this.ruleForm.tareWeight * 1) {
        Message({
          message: '毛重值应大于皮重值',
          type: 'error',
          duration: 3 * 1000
        })
        this.ruleForm.totalWeight = ''
      }
    },
    // 皮重
    handleTARE() {
      if (this.ruleForm.tareWeight) {
        this.ruleForm.tareWeight = (this.ruleForm.tareWeight * 1).toFixed(2)
      }
      if (this.ruleForm.totalWeight && this.ruleForm.totalWeight * 1 > this.ruleForm.tareWeight * 1) {
        this.ruleForm.netWeight = (this.ruleForm.totalWeight - this.ruleForm.tareWeight).toFixed(2)
        this.ruleForm.actualWeight = (this.ruleForm.netWeight - (this.ruleForm.packageWeight || 0) - (this.ruleForm.deductWeight || 0)).toFixed(2)
      } else if (this.ruleForm.tareWeight && this.ruleForm.totalWeight * 1 <= this.ruleForm.tareWeight * 1) {
        Message({
          message: '毛重值应大于皮重值',
          type: 'error',
          duration: 3 * 1000
        })
        this.ruleForm.tareWeight = ''
      }
    },
    // 更新下拉框
    async handleRefreshList(val) {
      if (val === 'carInfo') {
        let res = await carinfoApi(this.$farmCode)
        this.carList = res.data
      }
      if (val === 'driverInfo') {
        let res = await driverInfoApi(this.$farmCode)
        this.driverList = res.data
      }
      if (val === 'betcarInfo') {
        let res = await escortPersonApi(this.$farmCode)
        this.escortPersonList = res.data
      }
      if (val === 'cropInfo') {
        let res = await cropinfoSelectApi()
        this.cropinfoList = res.data
      }
      if (val === 'cropVariety') {
        if (!this.ruleForm.cropType) return
        let res = await cropTypeApi(this.ruleForm.cropType)
        this.cropVarietiesList = res.data
      }
      if (val === 'cropType') {
        let res = await categorySelectApi()
        this.categoryList = res.data
      }
      if (val === 'waterStandard') {

      }
      if (val === 'impurityStandard') {
      }
    }
  }
}
</script>

<style lang='scss' scoped>
.form {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}

.el-form-item {
  width: 33%;
  margin-bottom: 0;
}

::v-deep .widthLabel {
  .el-form-item__label {
    width: 160px !important;
  }
}

.fir-title {
  margin-top: 0 !important;
}

.title {
  font-size: 17px !important;
  margin: 2px 0 !important;
}

.button-box {
  margin-top: 60px;
}

.inStoragePCButton {
  width: 120px;
  height: 10vh;
  position: relative;
  float: left;
  background: #0e7b67;
  color: #fff;
  font-weight: 700;
  font-size: 1.2vw;
  line-height: 10vh;
  text-align: center;
  margin: 2vh 1vw;
  border-radius: 5px;
  cursor: pointer;
}


::v-deep .el-form-item__content {
  display: flex;
  align-items: center;
  height: 36px;
  line-height: 36px;
}

::v-deep .el-input {
  flex: 1;
  height: 36px;
}

::v-deep .el-select {
  flex: 1;
  height: 36px;
}

::v-deep .el-input__icon {
  line-height: 36px;
}

::v-deep .el-input__inner {
  height: 36px;
}

.dialog-footer333 {
  position: absolute;
  width: 180px;
  left: 50%;
  bottom: 3%;
  transform: translateX(-50%);
}
</style>
